import Vue from 'vue';
// 导入VueRouter
import VueRouter from 'vue-router'
// 安装VueRouter至vue
Vue.use(VueRouter)

// 创建 router 实例
// import HomeView from "@/views/HomeView";
// import AboutView from "@/views/AboutView";
// import BMIView from "@/views/BMIView";
import BMIView from '../views/BMIView';
// @ 是 /src 文件夹的别名

import MusicView from '@/views/MusicView'
import ArtistView from '@/views/ArtistView'
import ArtistSongsView from '@/views/ArtistSongsView'
import ArtistMVView from '@/views/ArtistMVView'
import ArtistDetailView from '@/views/ArtistDetailView'
import ArtistSimiView from '@/views/ArtistSimiView'
// import LoginView from "@/views/LoginView";
import TC from '@/views/TC';

const router = new VueRouter({
    mode: 'history',
    routes: [
        {
            path: '/',
            name: 'home',
            // bad
            // component: HomeView
            // good
            component: () => import('@/views/HomeView')
        },
        {
            path: '/bmi',
            name: 'bmi',
            component: BMIView,
            meta: { requiresAuth: true },
        },
        {
            path: '/t',
            component: TC
            /*component: () => {
                // 动态的import，路由懒加载（按需加载），
                return import('@/views/TC')
            }*/,
            children: [
                /*{
                    path: '',
                    // 命名视图
                    components: {
                        default: () => import('@/views/TCAbout'),
                        a: () => import('@/views/TCAAA'),
                        b: () => import('@/views/TCbbb'),
                    }
                }*/
            ]
        },
        {
            path: '/music',
            name: 'music',
            component: MusicView,
            meta: { requiresAuth: true }
        },
        {
            path: '/music/artist/:id',
            name: 'artist',
            component: ArtistView,
            meta: { requiresAuth: true },
            children: [
                { // /music/artist/:id/
                    path: '',
                    name: 'artist-songs',
                    component: ArtistSongsView
                },
                { // /music/artist/:id/mv
                    path: 'mv',
                    name: 'artist-mv',
                    component: ArtistMVView
                },
                { // /music/artist/:id/detail
                    path: 'detail',
                    name: 'artist-detail',
                    component: ArtistDetailView
                },
                { // /music/artist/:id/simi
                    path: 'simi',
                    name: 'artist-simi',
                    component: ArtistSimiView
                },
            ]
        },
        {
            path: '/about',
            name: 'about',
            // component: AboutView,
            component: () => import('@/views/AboutView'),
            // beforeEnter
        },
        {
            path: '/login',
            name: 'login',
            component: () => import('@/views/LoginView')
            // component: LoginView
        },
        {
            path: '/a',
            name: 'a',
            component: () => import('@/views/ModuleAView'),
        },
    ]

    // 首屏加载
})

// 路由的生命周期
// router.afterEach() 后置钩子
router.beforeEach((to, from, next) => {
    // to：即将进入的页面参数
    // from: 即将离开的页面参数
    // console.log('to', to)
    // console.log('from', from)
    // if (to.name !== 'login' && !localStorage.getItem('utoken')) {
    if (to.meta.requiresAuth && !localStorage.getItem('utoken')) {
        // 判断登录没，如果没有登录就得跳转至登录页
        // console.log(to.meta)
        // console.log(localStorage.getItem('utoken'))
        // next('/login')
        next({name: 'login'})
    } else {
        next()
        // next(false)
    }

})

export default router
